﻿    <div class="configurator">
        <ul>
            <li><kbd>Alt</kbd> + <kbd>F10</kbd> - move focus to the first button in the toolbar</li>
            <li><kbd>Left</kbd> or <kbd>Right</kbd> - move between toolbar buttons</li>
            <li><kbd>Down</kbd> or <kbd>Up</kbd> - move between options in toolbar lists</li>
        </ul>
        <ul>
            <li><kbd>Enter</kbd> - execute the current command</li>
            <li><kbd>Esc</kbd> - move focus to the content area to continue typing</li>
        </ul>
        <p>
            For more details, <a class="t-link" href="#code-viewer-tabs">see the description</a>
            below.</p>
    </div>
    @(Html.EasyUI().Editor()
           .Name("editor")
           .HtmlAttributes(new { style = "height:400px" })
           .Value(@<text>
              <p>
                    <img src="@Url.Content("~/Content/Editor/editor.png")"
                            alt="Editor for ASP.NET MVC logo"
                            style="display:block;margin-left:auto;margin-right:auto;" />

                    EasyUI Editor for ASP.NET MVC allows your users to edit HTML in a familiar,
                    user-friendly way.<br />
                    In this version, the Editor provides the core HTML editing engine, which includes
                    basic text formatting, hyperlinks, lists, and image handling.
                    The extension <strong>outputs identical HTML</strong>
                    across all major browsers, follows accessibility standards
                    and provides an extended programming API for content manipulation.
                </p>

                <p>Features include:</p>

                <ul>
                    <li>Text formatting & alignment</li>
                    <li>Bulleted and numbered lists</li>
                    <li>Hyperlink and image dialogs</li>
                    <li>Cross-browser support</li>
                    <li>Identical HTML output across browsers</li>
                    <li>Gracefully degrades to a <code>textarea</code>
                              when JavaScript is turned off</li>
                </ul>

                <p>
                    Read <a href="http://www.easyui.com/products/aspnet-mvc/editor.aspx">more details</a>
                    or send us your
                    <a href="http://www.easyui.com/community/forums/aspnet-mvc.aspx">feedback</a>!
                </p>
            </text>)
    )

@section HeadContent {
<style type="text/css">
    .configurator
    {
        margin: 0 0 2.3em;
    }
    
    .configurator ul
    {
        float: left;
        width: 48%;
        padding: 1.5em 0 0;
    }
    
    .configurator p
    {
        clear: both;
        padding: 2em 0 0;
    }
</style>
}